import React from 'react'
import { View, StyleSheet, Text } from 'react-native'
import { ScaleS, ScaleT } from 'src/utils/ScreenUtil'
import PropTypes from 'prop-types'
import CustomModalAnimatable from 'src/components/modal/CustomModalAnimatable'
import CustomButton from 'src/components/button/CustomButton'
import CustomImage from 'src/components/image/CustomImage'

export default class CompanyApplySuccessPop extends React.PureComponent {
  confirmed = false

  onConfirm = () => {
    this.confirmed = true
    this.props.onConfirm && this.props.onConfirm()
  }

  onModalHideTemp = () => {
    this.props.onModalHide && this.props.onModalHide(this.confirmed)
  }

  render () {
    return (
      <CustomModalAnimatable
        {...this.props}
        onModalHideTemp={this.onModalHideTemp}
      >
        <View style={styles.container}>
          <CustomImage
            style={styles.titleImg}
            source={require('src//imgC/company/popPass.png')}
          />
          <Text style={styles.titleLabel}>{this.props.title}
          </Text>
          <CustomButton style={styles.confirmBtn} onPress={this.onConfirm}>
            <Text style={styles.confirmText}>确定</Text>
          </CustomButton>
        </View>
      </CustomModalAnimatable>
    )
  }
}

CompanyApplySuccessPop.propTypes = {
  title: PropTypes.string,
  onConfirm: PropTypes.func,
  onModalHide: PropTypes.func,
  visible: PropTypes.bool
}
const styles = StyleSheet.create({
  container: {
    width: ScaleS(363),
    height: ScaleS(313),
    marginBottom: ScaleS(6),
    backgroundColor: '#FFFFFF',
    borderRadius: ScaleS(12),
    paddingHorizontal: ScaleS(10),
    alignSelf: 'center',
    alignItems: 'center',
    justifyContent: 'space-between'
  },
  titleImg: {
    marginTop: ScaleS(18)
  },
  titleLabel: {
    color: '#4A4A4A',
    fontSize: ScaleT(20),
    lineHeight: ScaleS(40),
    fontWeight: '500',
    textAlign: 'center'
  },
  confirmBtn: {
    marginBottom: ScaleS(28),
    width: ScaleS(297),
    height: ScaleS(45),
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: '#000000',
    borderRadius: ScaleS(10)
  },
  confirmText: {
    color: '#FFFFFF',
    fontSize: ScaleT(15),
    fontWeight: '600'
  }
})
